<template>
	<div v-loading="loading">
		<el-form>
			<h4>报名时间即将截止显示设置</h4>
            <br/>
			<el-form-item label="时间：">
				<div>
					<div class="ltr">
						<el-input-number v-model="stopTime" :min="0" controls-position="right" size="large" @change="(e)=>EditSetting(id1,e)" />天
						<!-- <span style="margin-left:20px">修改</span> -->
					</div>
					<div>距离报名结束时间还有 {{ stopTime }} 天，一站办培训列表将会红色提示</div>
				</div>
			</el-form-item>
			<h4>课程时间即将临近消息通知</h4>
            <br/>
			<el-form-item label="时间：">
				<div>
					<div class="ltr">
						<el-input-number v-model="approachTime" :min="0" controls-position="right" size="large" @change="(e)=>EditSetting(id2,e)" />天
						<el-form-item style="margin-left: 20px" label="是否启用:">
							<el-radio-group v-model="isUse" @change="(e)=>EditSetting(id3,e)">
								<el-radio value="1">是</el-radio>
								<el-radio value="0">否</el-radio>
							</el-radio-group>
						</el-form-item>
						<!-- <span style="margin-left:20px">修改</span> -->
					</div>
					<div>距离课程时间还有 {{ approachTime }}天，一站办报名的人员将会收到信息通知</div>
				</div>
			</el-form-item>
		</el-form>
	</div>
</template>

<script setup lang="ts">
import { ref, reactive, toRefs, onMounted } from 'vue'
import apiMod from '@/apiMod/index'

let loading = ref(false)
let isUse = ref(3)
let stopTime = ref(0)

let approachTime = ref(0)

let id1 = ref("")
let id2 = ref("")
let id3 = ref("")
const getSetting = () =>{
    loading.value = true
    apiMod.view_dpConfig_map({"category":4,"subCategory":5}).then(res=>{
        if(res.code==0){
            let data = res.data.bsc_training_management
            stopTime.value = data[0].value
            id1.value = data[0].id
            approachTime.value = data[1].value
            id2.value = data[1].id
            isUse.value = data[2].value
            id3.value = data[2].id
            loading.value = false
        }
        
    })
} 
getSetting()
const EditSetting = (id,val) =>{
    apiMod.view_dpConfig_edit({id:id,value:String(val)}).then(res=>{
        if(res.code==0){
            ElMessage.success('修改成功')
        }
    })
    }
</script>
<style scoped lang="scss">
.ltr {
	display: flex;
	flex-direction: row;
	justify-content: flex;
	align-items: center;
}
</style>
